var utils = {};

(function(){
	var request = ['r','webkitR','mozR','oR','msR'];
	var animationFrame;
	while(request.length){
		var pre=request.shift();
		if(window[pre+'equestAnimationFrame']){
			animationFrame = window[pre+'equestAnimationFrame'];
			break;
		}
	}

	if(!requestAnimationFrame){
		animationFrame = function(callback){
			return window.setTimeout(function(){
				callback();
			},1000/60)
		}
	}
	window.requestAnimationFrame = animationFrame;
}());

utils.captureMouse = function(element){
	var mouse = {x:0,y:0};
	element.addEventListener('mousemove',function(event){
		var x,y;
		if(event.pageX||event.pageY){
			x = event.pageX;
			y = event.pageY;
		}else{
			x = event.clientX+document.body.scrollLeft+document.documentElement.scrollLeft;
			y = event.clientY+document.body.scrollTop+document.documentElement.scrollTop;
		}

		x -= element.offsetLeft;
		y -= element.offsetTop;

		mouse.x = x;
		mouse.y = y;
	},false);

	return mouse;
}

function Arrow(){
	this.x = 0;
	this.y = 0;
	this.color = '#ffff00';
	this.rotation = 0;
}

Arrow.prototype.draw = function(context){
	context.save();
	context.translate(this.x,this.y);
	context.rotate(this.rotation)
	context.lineWidth = 2;
	context.fillStyle = this.color;
	context.beginPath();
	context.moveTo(-50,-25);
	context.lineTo(0,-25);
	context.lineTo(0,-50);
	context.lineTo(50,0);
	context.lineTo(0,50);
	context.lineTo(0,25);
	context.lineTo(-50,25);
	context.lineTo(-50,-25);
	context.closePath();
	context.fill();
	context.stroke();
	context.restore();
}




function Ball (radius,color){
	if(radius===undefined){
		radius = 40;
	}
	if(color===undefined){
		color = "#ff0000";
	}
	this.x = 0;
	this.y = 0;
	this.radius = radius;
	this.rotation = 0;
	this.scaleX = 1;
	this.scaleY = 1;
	this.color = color;
	this.lineWidth = 1;
}

Ball.prototype.draw = function(context){
	context.save();
	context.translate(this.x,this.y);
	context.rotate(this.rotation);
	context.scale(this.scaleX,this.scaleY);
	context.lineWidth = this.lineWidth;
	context.fillStyle = this.color;
	context.beginPath();
	context.arc(0,0,this.radius,0,(Math.PI*2),true);
	context.closePath();
	context.fill();
	if(this.lineWidth > 0) {
		context.stroke();
	}
	context.restore();
}